import * as React from 'react';
import Scroll from '../index';

const ScrollExample1: React.FunctionComponent = (props) => {
  return (
    <div>
      {/*<div>
        <h2>第一个例子</h2>
        <Scroll style={{height: 400,border:'1px solid red'}}>
          <p>1</p><p>2</p><p>3</p><p>4</p><p>5</p><p>6</p><p>7</p><p>8</p><p>9</p><p>10</p><p>11</p>
          <p>12</p><p>13</p><p>14</p><p>15</p><p>16</p><p>17</p><p>18</p><p>19</p><p>20</p><p>21</p>
          <p>22</p><p>23</p><p>24</p><p>25</p><p>26</p><p>27</p><p>28</p><p>29</p><p>30</p>
        </Scroll>
      </div>*/}

      {/*<div>
        <h2>第二个例子</h2>
        <Scroll autoHide={true} style={{height: 400,border:'1px solid red'}}>
          <p>1</p><p>2</p><p>3</p><p>4</p><p>5</p><p>6</p><p>7</p><p>8</p><p>9</p><p>10</p><p>11</p>
          <p>12</p><p>13</p><p>14</p><p>15</p><p>16</p><p>17</p><p>18</p><p>19</p><p>20</p><p>21</p>
          <p>22</p><p>23</p><p>24</p><p>25</p><p>26</p><p>27</p><p>28</p><p>29</p><p>30</p>
        </Scroll>
      </div>*/}

      <div>
        <h2>第三个例子</h2>
        <Scroll autoHide={true} hideOnPhone={false} onReachBottom={()=>{console.log('我知道触底了')}} style={{height: 400,border:'1px solid red'}}>
          <p>1</p><p>2</p><p>3</p><p>4</p><p>5</p><p>6</p><p>7</p><p>8</p><p>9</p><p>10</p><p>11</p>
          <p>12</p><p>13</p><p>14</p><p>15</p><p>16</p><p>17</p><p>18</p><p>19</p><p>20</p><p>21</p>
          <p>22</p><p>23</p><p>24</p><p>25</p><p>26</p><p>27</p><p>28</p><p>29</p><p>30</p>
        </Scroll>
      </div>

      {/*<div>
        <h2>第四个例子</h2>
        <Scroll hideOnPhone={false} style={{height: 400,border:'1px solid red'}} onPull={() => { console.log('外界知道用户释放下来更新了') }}>
          <p>1</p><p>2</p><p>3</p><p>4</p><p>5</p><p>6</p><p>7</p><p>8</p><p>9</p><p>10</p><p>11</p>
          <p>12</p><p>13</p><p>14</p><p>15</p><p>16</p><p>17</p><p>18</p><p>19</p><p>20</p><p>21</p>
          <p>22</p><p>23</p><p>24</p><p>25</p><p>26</p><p>27</p><p>28</p><p>29</p><p>30</p>
        </Scroll>
      </div>*/}
    </div>
  );
};

export default ScrollExample1;
